import 'package:flutter/material.dart';
import 'package:flutter_widgets/flutter_widgets.dart';

class ColorExt {
  static const primaryColor = Color(0xFFF19737);
  static const primaryColorFocus = Color(0xFFE48B2B);
  static const primaryColorLight = Color(0xFFF9E3CC);
  static const alertColor = Color(0xFFE30626);
  static const alertColorFocus = Color(0xFFCB001D);
  static const green = Color(0xFF53C53C);
  static const grey = Color(0xFF53C53C);
  static const lightPink = Color(0xFFFFD6DC);
  static const borderRed = Color(0xFFE30626);
  static const borderYellow = Color(0xFFF7BC33);
  static const borderGreen = Color(0xFF53C53C);
  static const borderBlue = Color(0xFF33C3FA);
  static const borderPurple = Color(0xFF5B42F1);
  static const borderPink = Color(0xFFF142A9);
  static const borderLightBlue = Color(0xFFAFE9FF);
  static const black20 = Color.fromRGBO(0, 0, 0, .2);
  static const black30 = Color.fromRGBO(0, 0, 0, .3);
  static const black60 = Color.fromRGBO(0, 0, 0, .6);
  static const loadingBg = Color(0xFFF6F6F6);

  static const _mainColor = 0xFFF19737;
  static const swatch = MaterialColor(_mainColor, <int, Color>{
    50: Color(0xFFFEF8E1),
    100: Color(0xFFFDECB3),
    200: Color(0xFFFCE082),
    300: Color(0xFFFBD64F),
    400: Color(0xFFFBCA29),
    500: Color(0xFFFAC209),
    600: Color(0xFFFBB400),
    700: Color(0xFFF7BE41),
    800: Color(_mainColor),
    900: Color(0xFFF19737),
  });
}

class Dimens {
  static const headlineTextSize = 24.0;
  static const subheadTextSize = 16.0;
  static const bodyTextSize = 14.0;
  static const captionTextSize = 12.0;
  static const overLineTextSize = 11.0;
  static const captionMultiLineHeight = 17 / 12.0;
  static const dividerThick = 0.5;
  static const dividerIndent = 16.0;
}

class Styles {
  static const textColor = Colors.black;
  static const primaryTextColorInverse = Colors.white;
  static const accentTextColor = ColorExt.primaryColor;
  static const secondaryTextColor = ColorExt.black60;
  static const alertTextColor = ColorExt.alertColor;
  static const hintTextColor = ColorExt.black30;

  static const headlineText = TextStyle(
      fontSize: Dimens.headlineTextSize,
      color: textColor,
      fontWeight: FontWeight.w600);
  static const headlineTextInverse = TextStyle(
      fontSize: Dimens.headlineTextSize,
      color: primaryTextColorInverse,
      fontWeight: FontWeight.w600);

  static const subheadText = TextStyle(
      fontSize: Dimens.subheadTextSize,
      color: textColor,
      fontWeight: FontWeight.w600);
  static const subheadTextInverse = TextStyle(
      fontSize: Dimens.subheadTextSize,
      color: primaryTextColorInverse,
      fontWeight: FontWeight.w600);

  static const bodyText =
      TextStyle(fontSize: Dimens.bodyTextSize, color: textColor);
  static const bodyTextInverse =
      TextStyle(fontSize: Dimens.bodyTextSize, color: primaryTextColorInverse);
  static const bodyTextAccent =
      TextStyle(fontSize: Dimens.bodyTextSize, color: accentTextColor);
  static const bodyText2 =
      TextStyle(fontSize: Dimens.bodyTextSize, color: secondaryTextColor);
  static const bodyTextAlert =
      TextStyle(fontSize: Dimens.bodyTextSize, color: alertTextColor);
  static const bodyTextHint =
      TextStyle(fontSize: Dimens.bodyTextSize, color: hintTextColor);
  static const captionTextAccent =
      TextStyle(fontSize: Dimens.captionTextSize, color: accentTextColor);
  static const captionText =
      TextStyle(fontSize: Dimens.captionTextSize, color: hintTextColor);
  static const captionTextInverse = TextStyle(
      fontSize: Dimens.captionTextSize, color: primaryTextColorInverse);
  static const captionTextAlert =
      TextStyle(fontSize: Dimens.captionTextSize, color: alertTextColor);

  static const overLineTextInverse = TextStyle(
      fontSize: Dimens.overLineTextSize, color: primaryTextColorInverse);
  static const overLineText =
      TextStyle(fontSize: Dimens.overLineTextSize, color: hintTextColor);

  static const dialogTitle = TextStyle(
    fontSize: Dimens.subheadTextSize,
    color: textColor,
  );
}

class Themes {
  static final widgetThemeData = WidgetThemeData(
    buttonStyle: const CustomButtonStyle(
      flatButtonStyle: FlatButtonStyle(
          highlightColor: Colors.transparent, textStyle: Styles.bodyTextAccent),
      outlinedButtonStyle: OutlinedButtonStyle(
        width: 250,
        height: 48,
        borderColor: ColorExt.primaryColor,
        textStyle: Styles.bodyTextAccent,
        highlightColor: Colors.transparent,
        // splashColor: ColorExt.primaryColorLight,
      ),
      raisedButtonStyle: RaisedButtonStyle(
        elevation: 0,
        highlightElevation: 0,
        disabledElevation: 0,
        textStyle: Styles.bodyTextInverse,
      ),
    ),
  );

  static final appTheme = ThemeData(
    textSelectionTheme:
        const TextSelectionThemeData(cursorColor: ColorExt.primaryColor),
    primarySwatch: ColorExt.swatch,
    primaryColorLight: ColorExt.primaryColorLight,
    dividerTheme: const DividerThemeData(
      color: Colors.black12,
      space: Dimens.dividerThick,
      thickness: Dimens.dividerThick,
      indent: Dimens.dividerIndent,
      endIndent: Dimens.dividerIndent,
    ),
    appBarTheme: const AppBarTheme(
      elevation: 0,
      color: Colors.white,
      titleTextStyle: Styles.subheadText,
      iconTheme: IconThemeData(size: 24),
    ),
    textTheme: const TextTheme(
      headline6: Styles.headlineText,
      subtitle2: Styles.subheadText,
      bodyText2: Styles.bodyText,
      bodyText1: Styles.bodyText2,
      caption: Styles.captionText,
      overline: Styles.overLineText,
    ),
    primaryTextTheme: const TextTheme(
      headline6: Styles.headlineText,
      subtitle2: Styles.subheadText,
      bodyText2: Styles.bodyTextAccent,
      caption: Styles.captionTextAccent,
    ),
    inputDecorationTheme:
        const InputDecorationTheme(hintStyle: Styles.bodyTextHint),
    scaffoldBackgroundColor: Colors.white,
    buttonTheme: const ButtonThemeData(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.all(Radius.circular(24)),
      ),
      buttonColor: ColorExt.swatch,
      highlightColor: ColorExt.swatch,
      // splashColor: ,
      disabledColor: Colors.black12,
      padding: EdgeInsets.symmetric(horizontal: 18, vertical: 11),
    ),
    dialogTheme: const DialogTheme(
      titleTextStyle: Styles.dialogTitle,
      contentTextStyle: Styles.bodyText2,
    ),
    sliderTheme: const SliderThemeData(
      trackHeight: 4,
      thumbShape: RoundSliderThumbShape(enabledThumbRadius: 6),
    ),
  );
}
